<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript">
	var i=-1,j=0,x=0;
	function draw(){
		
		setInterval(tanqiu,5)
		
		}
	function tanqiu(){
		
		if(j<500){
			i=i+1;
		j=5*i*i/1000
		a=document.getElementById('huabu').getContext('2d');
		a.clearRect(0,0,500,1000)
		a.strokeStyle="green";
		a.beginPath();
		a.arc(315,j+15,15,0,Math.PI*2,true);
		a.stroke();
		}
		else{
			i=i-1;
			x=5*i*i/1000
			a=document.getElementById('huabu').getContext('2d');
			a.clearRect(0,0,500,1000)
			a.strokeStyle="red";
			a.beginPath();
			a.arc(315,x+15,15,0,Math.PI*2,true);
			a.stroke();
			if(x==0){
				j=0
				}
			}
		
		}
</script>
</head>

<body onLoad="draw()">
<canvas id="huabu" width="500" height="530"></canvas>
</body>
</html>
